<template>
    <div class="container">
        <p class="item" style="grid-row: 1; grid-column: 1">保单号：1</p>
        <p class="item" style="grid-row: 1; grid-column: 2">报案账户：12345</p>
        <p class="item" style="grid-row: 2; grid-column: 1">证件号码：1111111111111</p>
        <p class="item" style="grid-row: 2; grid-column: 2">报案时间：2020年1月1日 0时0分</p>
        <p class="item" style="grid-row: 3; grid-column: 1">已拥有保险：人身意外险</p>
        <p class="item" style="grid-row: 3; grid-column: 2">报案待审核额度：500000</p>
        <p class="item" style="grid-row: 4; grid-column: 1">保单额度：100000</p>
        <p class="item" style="grid-row: 4; grid-column: 2">案件情况：待接受</p>
    </div>
</template>

<script>
    export default {
        name: "QueryProcess",
    }
</script>

<style scoped>
    .container {
        display: grid;
        grid-template-columns: 400px 400px;
        grid-template-rows: 100px 100px 100px 100px;
        grid-auto-flow: row dense;
        margin-top: 20px;
        justify-content: center;
    }

    .item {
        border: 1px silver solid;
        text-align: center;
        /*垂直居中*/
        line-height: 100px;
    }

</style>